<template>
	<text class="bi-car-status" :class="className">
		{{ text }}
	</text>
</template>

<script>
export default {
	name: 'BiCarStatus',
	props: {
		type: {
			type: String
		},
		text: {
			type: String
		}
	},
	computed: {
		itemsMap () {
			return {
				'车辆到期': 'expire',
				'闲置': 'leisure',
				'工作中': 'working',
				'已出发': 'driving',
				'已接单': 'received'
			}
		},
		className () {
			return this.itemsMap[this.type] ? 'is-' + this.itemsMap[this.type] : ''
		}
	}
}
</script>

<style lang="less">
.bi-car-status{
	font-size: 12px;
	&.is-expire{
		color: #999;
	}
	&.is-leisure{
		color: #40CC6C;
	}
	&.is-working{
		color: #F47554;
	}
	&.is-driving{
		color: #5875ec;
	}
	&.is-received{
		color: #e0353f;
	}
}
</style>